<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <script src="../jquery/jquery-3.6.0.js"></script>
</head>

<body>

<img class="bgone" src="img/1.jpg" />
<img class="pic" src="img/a.png" />

<div class="table">
    <div class="wel">电子科大网络安全云平台</div>
    <div class="wel1">MOU MOU XI TONG HUO TAI DENG LU</div>
    <div class="user">
        <div style=""><img src="img/yhm.png" /></div>
        <input type="text" name="" placeholder="用户名" id="username"/>
    </div>
    <div class="password">
        <div><img src="img/mm.png" /></div>
        <input type="password" name="密码" placeholder="●●●●●●" id="password"/>
    </div>
    <input class="btn" type="button" name="登录" value="登录" id="loginButton"/>
</div>

</body>
<script>
    $("#loginButton").click(function () {
        let username = $("#username").val();
        let password = $("#password").val();
        $.ajax({
            url:"/user/login",           // 请求路径
            type:"post",                  // 请求的方式，不区分大小写
            cache:false,                  // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
            contentType:"application/json;charset=utf-8",
            data: JSON.stringify({
                username:username,
                password:password
            }),
            datatype:"json",        // 返回类型，text文本、html页面、json数据
            success:function(response){
                console.log("返回: " + JSON.stringify(response));
                if(response.code === 200) {
                    alert("登录成功, 欢迎您！ " + username);
                    localStorage.setItem("username", username);
                    window.location.href = "../index.html";
                }
                else {
                    alert(response.msg);
                }
            },
            error:function(response){
                console.log("出错返回: " + response);
            }
        });
    });
</script>
</html>